<template>
    <el-card class="table-card">
        <div slot="header" class="clearfix">
            <!--工具条-->
            <el-form :inline="true" :model="filters" class="filter-form-box">
                <el-form-item>
                    <el-select size="small" v-model="filters.classIndex" placeholder="请选择班级" @input="filterClassChange">
                        <el-option
                                v-for="(item, index) in classList"
                                :key="index"
                                :label="item.classYear+'级 '+item.className"
                                :value="index">
                        </el-option>
                    </el-select>
                </el-form-item>
                <el-form-item>
                    <el-input size="small" v-model="filters.content" class="input-with-select" placeholder="请输入你要查询的内容">
                        <el-select v-model="filters.select" slot="prepend" placeholder="请选择" style="width: 75px;">
                            <el-option label="学号" value="1"></el-option>
                            <el-option label="名称" value="2"></el-option>
                        </el-select>
                    </el-input>
                </el-form-item>
                <el-form-item style="margin-right: 0;">
                    <el-button size="mini" v-on:click="isShowAdvancedSearch=!isShowAdvancedSearch" title="高级搜索">
                        <i class="el-icon-plus" v-show="!isShowAdvancedSearch"></i>
                        <i class="el-icon-minus" v-show="isShowAdvancedSearch"></i>
                    </el-button>
                </el-form-item>
                <el-form-item style="margin-right: 0;">
                    <el-button size="mini" v-on:click="refreshFilters" title="重置"><i class="el-icon-refresh"></i></el-button>
                </el-form-item>
                <el-form-item>
                    <el-button size="mini" v-on:click="getData(filters.classIndex)" title="搜索"><i class="el-icon-search"></i></el-button>
                </el-form-item>
            </el-form>
        </div>
        <!--列表-->
        <el-table stripe border :data="datas" highlight-current-row v-loading="listLoading" @selection-change="selsChange" style="width: 100%;">
            <el-table-column type="index" width="60">
            </el-table-column>
            <el-table-column prop="schoolNumber" label="学号" sortable>
            </el-table-column>
            <el-table-column prop="name" label="姓名" sortable>
            </el-table-column>
            <el-table-column prop="departmentName" label="所属院系" sortable>
            </el-table-column>
            <el-table-column prop="specialtyName" label="所属专业" sortable>
            </el-table-column>
            <el-table-column prop="className" label="所属班级" sortable>
            </el-table-column>
            <el-table-column prop="entranceYear" label="入学年份" sortable>
            </el-table-column>
            <el-table-column prop="remark" label="备注" sortable>
            </el-table-column>
        </el-table>

        <!--工具条-->
        <el-col :span="24" class="toolbar">
            <el-pagination layout="prev, pager, next" @current-change="handleCurrentChange" :page-size="20" :total="total" style="float:right;">
            </el-pagination>
        </el-col>
    </el-card>
</template>

<script>
  import {getRelevancyList, getStudentList} from '../../api/api';

  export default {
    data() {
      return {
        filters: {
          select: '1',
          classIndex: 0,
          courseIndex: 0,
          content: '',
        },
        isShowAdvancedSearch: false,

        userId: '',
        datas: [],
        classList: [],
        courseList: [],

        total: 0,
        page: 0,

        listLoading: false,
        sels: [],//列表选中列
      }
    },
    methods: {
      handleCurrentChange(val) {
        this.page = val;
        this.getData(0);
      },

      filterClassChange(val){
        this.getData(val);
      },

      filterCourseChange(val){
        this.getData(val);
      },

      //重置搜索条件
      refreshFilters(){
        this.filters.select='1';
        this.filters.content= '';
        this.getData(this.filters.classIndex,this.filters.courseIndex);
      },

      //获取数据列表
      getData(val) {
        let para = {
          count: 10,
          pageNo: this.page,
          sortDirection: 'asc',
          sortField: ["name"],
          classId: '',
          specialtyId: '',
          name: '',
          schoolNumber: '',
          departmentId: '',
          entranceYear: '',
        };

        para.departmentId = this.classList[val].departmentId;
        para.specialtyId = this.classList[val].specialtyId;
        para.classId = this.classList[val].classId;

        if(this.filters.select === '1'){
          para.schoolNumber = this.filters.content;
        }else if(this.filters.select === '2'){
          para.name = this.filters.content;
        }

        console.log(para);
        this.listLoading = true;
        getStudentList(para).then((res) => {
          console.log(res);
          this.total = res.data.data.totalPages;
          this.datas = res.data.data.content;
          this.listLoading = false;
        });
      },

      //获取数据列表
      getRelevancyData(val1,val2,val3) {
        console.log(val1+'\n'+val2+'\n'+val3);
        let para = {
          count: 10,
          pageNo: this.page,
          sortDirection: 'asc',
          sortField: ["name"],
          departmentId: '',
          specialtyId: '',
          classId: '',
          courseId: '',
          year: val2,
          teacherId: val1,
          semester: val3,
        };

        getRelevancyList(para).then((res) => {
          console.log(res.data.data.content);
          let dataArr =  res.data.data.content;
          if(dataArr.length>0){
            for(let i=0; i < dataArr.length; i++){
              if(!this.classList.find(item => item.classId === dataArr[i]['classId'])){
                this.classList.push({
                  classId: dataArr[i]['classId'],
                  className: dataArr[i]['className'],
                  classYear: dataArr[i]['classYear'],
                  specialtyId: dataArr[i]['specialtyId'],
                  departmentId: dataArr[i]['departmentId']
                })
              }
            }
            this.getData(0);
          }
        });
      },

      selsChange: function (sels) {
        this.sels = sels;
      },
    },
    mounted() {
      let newDate = new Date();
      let year = newDate.getFullYear();
      let val1 = year-1;
      let val2 = year+1;
      let schoolYear;
      let semester;
      let month = newDate.getMonth()+1;

      if(month >= 9){
        schoolYear = year+'-'+val2;
        semester = 1
      }else{
        schoolYear = val1+'-'+year;
        semester = 2
      }

      let user = sessionStorage.getItem('user');
      user = JSON.parse(user);

      this.userId = user.id;
      this.getRelevancyData(user.id,schoolYear,semester);
    }
  }

</script>

<style scoped>

</style>